<template>
	<view class="content">
		<titleBox :item="item"></titleBox>
		<view>
			<uni-calendar 
			:insert="true"
			:lunar="true" 
			@confirm="confirm"
			@change="change"
			@monthSwitch="monthSwitch"
			:selected="info.selected"
			 />
		</view>
		<view class="journal-Card">
			<journalCard :item="journalInfo"></journalCard>
		</view>
		<view class="add" @click="checkEditor()">
			<view class="selectDate">
				{{monthDay}} 
				+
				
			</view>
			
		</view>
	</view>
</template>

<script>
	import {getJournalState,getJournalByDate} from '@/api/journal.js';
		/**
		 * 获取任意时间
		 * 日历组件选择日期返回的方法
		 */
		function getDate(date, AddDayCount = 0) {
			if (!date) {
				date = new Date()
			}
			if (typeof date !== 'object') {
				date = date.replace(/-/g, '/')
			}
			const dd = new Date(date)
	
			dd.setDate(dd.getDate() + AddDayCount) // 获取AddDayCount天后的日期
	
			const y = dd.getFullYear()
			const m = dd.getMonth() + 1 < 10 ? '0' + (dd.getMonth() + 1) : dd.getMonth() + 1 // 获取当前月份的日期，不足10补0
			const d = dd.getDate() < 10 ? '0' + dd.getDate() : dd.getDate() // 获取当前几号，不足10补0
			return {
				fullDate: y + '-' + m + '-' + d,
				year: y,
				month: m,
				date: d,
				day: dd.getDay()
			}
		}
	
	export default {
		data() {
			return {
				item:{
					pageName:'calendar'
				},
				dayList:[],
				info: {
					lunar: true,
					range: true,
					nsert: false,
					selected: [{
						date: getDate(new Date(),-3).fullDate,
						info: '已写'
					}]
				},
				wirteList:[],
				selectDay:"",
				monthDay:"",
				journalInfo:{
					content:"今天没写日记哦....."
				}
			};
		},
		onLoad() {
			this.getDayList()
			this.getJourjalState()
			this.getTodayJournal()
		},
		methods:{
			//跳转写日记
			checkEditor(){
				uni.navigateTo({
					url:"/pages/editor/editor?date="+this.selectDay+"&journalId="+this.journalInfo.id
				})
			},
			getTodayJournal(){
				// 获取今天的日期  
				let today = new Date();  
				  
				// 设置日期格式  
				let formattedDate = today.getFullYear() + '-' +  
				    ('0' + (today.getMonth() + 1)).slice(-2) + '-' +  
				    ('0' + today.getDate()).slice(-2);  
				this.selectDay = formattedDate
				console.log(this.selectDay)
				this.formatDate(this.selectDay)
				this.getJournal()  
				
			},
			confirm(e) {
				console.log(e);
			},
			//获取日期的格式转换
			formatDate(date){
				const parts = this.selectDay.split("-"); // 使用"-"分割字符串
				const monthDay = `${parts[1]}-${parts[2]}`; // 组合月份和日期  
				this.monthDay=monthDay
				console.log(this.selectDay)
			},
			change(e){
				this.selectDay = e.fulldate
				this.formatDate(this.selectDay)
				this.getJournal()
				
			},
			monthSwitch(e){
				console.log(e)
				var dates = this.getDatesInMonth(e.month,e.year)
				this.dayList = dates
				this.getJourjalState()
			},
			getDayList(){
				// 获取当前日期
				let today = new Date();  
				  
				// 设置日期格式  
				let dateFormat = function(d) {  
				    let month = d.getMonth() + 1; // getMonth() is zero-based  
				    let day = d.getDate();  
				    return [d.getFullYear(),   
				            (month < 10 ? '0' : '') + month, // pad month with leading zero  
				            (day < 10 ? '0' : '') + day].join('-'); // pad day with leading zero  
				}  
				  
				// 获取从月初到今天的日期  
				let dates = [];  
				let startOfMonth = new Date(today.getFullYear(), today.getMonth(), 1);  
				while (startOfMonth <= today) {  
				    dates.push(dateFormat(startOfMonth));  
				    startOfMonth.setDate(startOfMonth.getDate() + 1);  
				}  
				this.dayList = dates
				
			},
			getJourjalState(){
				getJournalState({
					"dates":this.dayList,
					"id":uni.getStorageSync("id"),
					"token":uni.getStorageSync("authorization")
				}).then(res=>{
					this.wirteList = res.data.data
					this.writeJournalState(this.wirteList)
					
				})
			},
			writeJournalState(days){
				
				const select = []
				for (var date of days) { 
					const day={
						date: date,
						info: '已写'
					}
				    select.push(day)
				}
				this.info.selected = select
			},
			getDatesInMonth(month,year) {  
				let dates = [];  
			    let date = new Date(year, month - 1, 1); // 注意月份是从0开始的，所以需要减1  
			    let lastDay = new Date(date.getFullYear(), date.getMonth() + 1, 1);  
			    while (date <= lastDay) {  
			       dates.push(date.toISOString().slice(0, 10)); // 将日期对象转换为指定格式的字符串  
			       date.setDate(date.getDate() + 1);  
			    }  
			    return dates;  
			},
			getJournal(){
				getJournalByDate({
					"date":this.selectDay,
					"id":uni.getStorageSync("id"),
					"token":uni.getStorageSync("authorization")
				}).then(res=>{
					if(res.data.data!=null){
						this.journalInfo = res.data.data
						console.log(this.journalInfo.id)
					}else{
						this.journalInfo = {
							content:"今天没写日记哦....."
						}
						
					}
				
					
					
				})
			}
		}
	}
</script>

<style lang="scss">
page{
	background-image: url('../../static/bg.png');
	background-repeat: no-repeat;
	background-size: cover;
}
.content{
	.add{
		width: 100rpx;
		height: 100rpx;
		background-color: $font-blue;
		position: fixed;
		bottom: 80rpx;
		right: 10%;
		border-radius: 100rpx 100rpx;
		line-height:100rpx;
		text-align: center;
		.selectDate{
			color: white;
			font-size: 1%;
			position: relative;
			
		}
		
	}
}
</style>
